import React, { memo } from "react";
import { ListTitleStyle } from "./style";

export default memo(function ListTitle(props) {
  return (
    <ListTitleStyle>
      <div
        className={
          props.pageName === "playlist"
            ? "playlist-r-top"
            : props.pageName === "song"
            ? "songPage-text clear"
            : props.pageName === "djRadio"
            ? "djRadio-title"
            : ""
        }
      >
        <i
          className={
            props.pageName === "playlist"
              ? "playlist-icon imgIcon"
              : props.pageName === "song"
              ? "tips imgIcon fl"
              : props.pageName === "djRadio"
              ? "icon-title imgIcon"
              : ""
          }
        ></i>
        <span
          className={props.pageName === "playlist" ? "playlist-r-top-text" : ""}
        >
          {props.pageName === "playlist"
            ? props.playlistData.playlist.name
            : props.pageName === "song"
            ? props.songDetailInfo
            : props.pageName === "djRadio"
            ? props.djRadioName
            : ""}
        </span>
      </div>
    </ListTitleStyle>
  );
});
